import React, { PureComponent } from 'react'
import PropTypes from 'prop-types'
import ResponsiveImage from '@/components/ResponsiveImage'
import { formatNumber } from '@/utils'
import css from './postLive.module.scss'
export default class SpacePostLive extends PureComponent {
    static propTypes = {
        roomid: PropTypes.number,
        roomType: PropTypes.string,
        roomTypeId: PropTypes.number,
        online: PropTypes.number,
        liveStatus: PropTypes.number,
        liveTime: PropTypes.string,
        title: PropTypes.string,
        cover: PropTypes.string   
    }

    state = {
        size: '@702w_394h'
    }

    get status() {
        const { liveStatus } = this.props
        return liveStatus > 0 ? (liveStatus === 2 ? '轮播中' : '直播中') : '直播结束'
    }

    handleLive = () => {

    }

    render() {
        const { cover, title, online, roomType } = this.props
        const { size } = this.state
        return (
            <div className={css["wrap"]}>
                <ResponsiveImage className="cover" src={cover} size={size}>
                    <div className="count">
                        <span>{ roomType }</span>
                        <span>{ formatNumber(online) }人气</span>
                    </div>
                    <div className="title">{ title }</div>
                    <div className="status">{ this.status }</div>
                </ResponsiveImage>             
            </div>
        )
    }
}
